<template>
  <div>
    <h1>投标文件查看</h1>
    <ClTable :table-data="supplierFileInfoList" :column-list="columns" :filter-form-item="filterFormItem">
      <template #column>
        <el-table-column label="操作" width="250">
          <template #default="{ row }">
            <el-button type="primary" link @click="handleDownload(row)">下载</el-button>
            <el-button v-if="row.viewPath" type="primary" link @click="handleOpen(row.viewPath)">查看</el-button>
          </template>
        </el-table-column>
      </template>
    </ClTable>
  </div>
</template>

<script setup lang="ts">
import { supplierFileInfoDownload, supplierFileInfoList, supplierInfoList } from '@/api/electronic-bid-file'

onMounted(() => {
  getOptions()
})

const columns = [
  {
    label: '文件名称',
    prop: 'fileName'
  },
  {
    label: '供应商',
    prop: 'supplierName'
  }
]
const filterFormItem = ref([
  {
    key: 'supplierId',
    value: undefined,
    name: '供应商名称',
    formType: 'select',
    elementConfig: {
      options: [],
      textareaWidth: '376px'
    }
  }
])

const getOptions = async () => {
  const { rows }: any = await supplierInfoList({})
  filterFormItem.value[0].elementConfig.options = rows.map((item: any) => ({
    key: item.id,
    value: item.supplierName
  }))
}
const handleDownload = async (row: any) => {
  try {
    const res = await supplierFileInfoDownload({ id: row.id })
    downloadFile(row.fileName, res.data)
  } catch (error) {
    console.log('🐷 🐽 onDownload 🐽 error👉👉👉', error)
  }
}
const handleOpen = (row: any) => {
  window.open(row, '_blank')
}
</script>
<style scoped>
@import url('@/components/cl-table/index.scss');
</style>
